<!doctype html>
<html lang="en">
<head>
    @include('web.layout.head')
    <link rel="stylesheet" href="{{mix('/css/web/user/aptitude.css')}}">
    <script src="{{mix('/js/web/frame/distpicker.js')}}"></script>
</head>
<body>

@include('web.layout.header')
@include('web.layout.user_tab')
<div class="base_member_content">
    <div class="w1200">
    @include('web.layout.seller_nav')
        <div class="right fr">
            <div class="marryreal">
                <div class="line_title">资质添加</div>
                <div class="category_main">
                    <span>类目： 工程服务 >资质服务</span>
                </div>
                <form method="post" id="postForm"  enctype ="multipart/form-data">
                    <div class="right_input_main fl">
                        <span>资质名称</span>
                        <select id="one_level">
                            <option value="">请选择资质名称</option>
                            <option value="1">电力工程专业承包</option>
                            <option value="2">电力智能化工程专业承包</option>
                        </select>
                        <select id="two_level">
                            <option value="">请选择资质级别</option>
                            <!-- <option value="1">一级</option>
                            <option value="2">二级</option> -->
                        </select>
                    </div>
                    <div class="right_input_main fl">
                        <span>收费情况</span>
                        <input type="text" name="stamp_charge" class="stamp_charge" value="" placeholder="盖章费(元)">
                        <input onkeyup="this.value=this.value.replace(/[^0-9.]/g,'')"  type="text" name="implementation_fee" class="implementation_fee" value="" placeholder="实施费%">
                        <font>投标后按项目金额的比率收费</font>
                    </div>
                    <div class="right_input_main fl">
                        <span>地址</span>
                        <div id="distpicker">
                            <select class="province" name="province_id">
                                <option>请选择省份</option>
                            </select>
                            <select class="city" name="city_id">
                                <option>请选择城市</option>
                            </select>
                        </div>
                    </div>
                    <div class="right_input_main fl">
                        <span>列表图</span>
                        <div class="liulan_btn fl">
                            <img src="{{asset('/img/web/user/liulan_bj.jpg')}}">

                        </div>
                        <input type="file" class="fileupload" name="image" style="display:none" id="js-photo-upload" />
                    </div>
                    <div class="img_list_main fl">
                        <span></span>
                        <div class="img_list fl">
                            <!-- <div class="img fl">
                                <img src="/img/web/user/close.png" class="icon-colse">
                                <img src="{{asset('/img/web/product/video1.jpg')}}" class="show_img">
                            </div>
                            <div class="img fl">
                                <img src="{{asset('/img/web/product/pinpai01.jpg')}}">
                            </div>
                            <div class="img fl">
                                <img src="{{asset('/img/web/product/sprit_01.png')}}">
                            </div> -->
                        </div>
                    </div>
                    <div class="right_input_main fl">
                        <span>橱窗推荐</span>
                        <div class="windowlist">
                            <label><input class="window" type="checkbox" name="is_cupboard" value="1">是</label>
                            <span>您的橱窗使用情况：共【15】个，已用【8】个。</span>
                        </div>
                    </div>
                    <div class="btn_main fl">
                        <input type="button" data-type="1" class="release_btn" value="发布资质">
                        <input type="button" data-type="0" class="drafts_btn" value="保存至草稿">
                        <input type="hidden" value="" name="type">
                    </div>
                </form>
            </div>
        </div>
    </div>

</div>
@include('web.layout.footer')
<script type="text/javascript">
$(document).ready(function(){
    var province = "";
    var city = "";
    $('#distpicker').distpicker({
        province: province,
        city: city
    });

    // 图片上传
    $('#js-photo-upload').change(function(){
        var url = AJAX_URL + '/uploads/images';
        var files =  this.files[0];
        var formFile = new FormData();
        formFile.append("image", files);
        $.ajax({
            url: url,
            type: "POST",
            data: formFile,
            contentType: false,
            cache: false,
            processData: false,
            // 显示加载图片
            success: function (res) {
                if (res.status == 0){
                    var html_img = '<div class="img fl">'
                                        +'<img src="/img/web/user/close.png" class="icon-colse">'
                                        +'<img src="'+res.path+'" class="show_img">'
                                        +'<input type="hidden" value="'+res.path+'" name="img[]">'
                                    +'</div>';
                    $(".img_list").append(html_img);

                } else {
                    layer.alert('图片上传失败', {
                        title:'提示',
                        icon: 2
                    });
                }
            },
            error: function () { }
        });
    })
    $(".liulan_btn").click(function () {
        $("#js-photo-upload").trigger("click");

    });

    $(document).on('click', '.icon-colse', function () {
        $(this).parent().remove();
    });
    //实施费验证
    $('.implementation_fee').blur(function(){
        var re = /^\d+(?=\.{0,1}\d+$|$)/
        if ($(this).val() != "") {
            if (!re.test($(this).val())) {
                layer.alert('请输入数字', {
                    title:'提示',
                    icon: 2
                });
                $(this).val('')
                $(this).focus();
            }
        }
        if($(this).val() > 100){
            layer.alert('实施费比率不能超过100', {
                title:'提示',
                icon: 2
            });
            $(this).val('')
            $(this).focus();
        }
    });

    //选择资质名称
    $('#one_level').change(function(){
        var id = $(this).val();
        $.ajax({
          url: '',
          type: 'post',
          dataType: 'json',
          data: {id,id},
          success:function (data) {
              if (data.code == 0) {
                var html = '<option value="">请选择资质级别</option>';
                for(var i in data.data){
                    html = html + '<option value="1">一级</option>';
                }
                $(".img_list").html(html);
              }else{
                  layer.alert('操作失败',{icon: 1});
              }
          }
      })
    });
    $(".release_btn, .drafts_btn").click(function () {
        var type = $(this).attr('data-type');
        $('input[name="type"]').val(type);
        if($('#two_level option:selected').val()  == ''){
            layer.alert('请选择资质级别', {
                title:'提示',
                icon: 2
            });
            return false;
        }
        if($('.stamp_charge').val()  == ''){
            layer.alert('请输入盖章费', {
                title:'提示',
                icon: 2
            });
            return false;
        }
        if($('.implementation_fee').val()  == ''){
            layer.alert('请输入实施费', {
                title:'提示',
                icon: 2
            });
            return false;
        }
        if($('.city option:selected').val()  == ''){
            layer.alert('请选择地址', {
                title:'提示',
                icon: 2
            });
            return false;
        }
        if($('input[name="img[]"]').length == 0){
            layer.alert('请上传列表图', {
                title:'提示',
                icon: 2
            });
            return false;
        }
        $.ajax({
            url: '',
            type: 'post',
            data: $('#postForm').serialize(),
            dataType:'json',
            success: function (data) {
                if(data.code==0){
                    layer.msg("提交成功!",{icon: 1}, function () {
                        location.href = '/member/seller/aptitude';
                    });
                }else{
                    layer.alert("提交失败!",{icon: 0});
                }
            }
        });

    });
});

</script>
</body>
</html>